<%@ tag language="java" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<%@ attribute name="input" type="java.lang.String" required="true" description="输入框"%>
<%@ attribute name="type" type="java.lang.String" required="true" description="files、images、flash、thumb、music、cert"%>
<%@ attribute name="uploadPath" type="java.lang.String" required="false" description="服务器接收URL地址"%>
<%@ attribute name="uploadNum" type="java.lang.String" required="false" description="一次最多传几张"%>
<%@ attribute name="uploadParamValue" type="java.lang.String" required="false" description="参数值"%>
<%@ attribute name="uploadParamName" type="java.lang.String" required="false" description="参数名"%>
<%@ attribute name="uploadFileParamName" type="java.lang.String" required="false" description="file参数名，默认是file"%>
<%@ attribute name="uploadTipDesc" type="java.lang.String" required="false" description="在对话框中的提示信息"%>
<%@ attribute name="readonly" type="java.lang.Boolean" required="false" description="是否查看模式"%>
<%@ attribute name="maxWidth" type="java.lang.String" required="false" description="最大宽度"%>
<%@ attribute name="maxHeight" type="java.lang.String" required="false" description="最大高度"%>
<%@ attribute name="closeImg" type="java.lang.String" required="false" description="最大高度"%>

<c:set var="vUploadNum" value="${fns:defaultIfBlank(uploadNum,'1')}"/>
<c:set var="vUploadPath" value="${fns:defaultIfBlank(uploadPath,ctx.concat('/fileupload/upload'))}"/>
<c:if test="${type eq 'thumb'}"><c:set var="ctype" value="images"/></c:if>
<c:if test="${type ne 'thumb'}"><c:set var="ctype" value="${type}"/></c:if>
<c:set var="closeImgTmp" value="x"/>
<c:if test="${not empty closeImg}"><c:set var="closeImgTmp" value="<img src='${closeImg}'></img"/></c:if>
<script type="text/javascript" src="${ctxStatic}/webuploader015/upload.js?v=137dddd5559"
		uploadPath="${vUploadPath}" inputId="${input}" uploadNum="${vUploadNum}" uploadFileParamName="${uploadFileParamName}"
		uploadType="${ctype}" uploadParamValue="${uploadParamValue}" uploadParamName="${uploadParamName}">
</script>
<ol id="${input}Preview"></ol>
<c:if test="${!readonly}">
	<a href="javascript:" onclick="${input}FinderOpen();" class="btn">${selectMultiple?'添加':'选择'}</a>&nbsp;
	<a href="javascript:" onclick="${input}DelAll();" class="btn">清除</a>
</c:if>
<div class="modal fade" id="${input}myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
	 aria-hidden="true"  data-backdrop="false" style="width:840px;margin-left:-420px;top:-1000px">
	<div class="modal-dialog" >
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
				<h3 class="modal-title" id="myModalLabel">标题</h3>
			</div>
			<div class="modal-body">
				<div id="container" class="zgq_container">
					<!--头部，相册选择和格式选择-->
					<div id="${input}uploader" class="zgq_uploader">
						<div class="queueList">
							<div id="${input}dndArea" class="placeholder">
								<div id="${input}filePicker"></div>
								<c:choose>
									<c:when test="${empty uploadTipDesc}">
										<p>或将照片拖到这里，单次最多可选${vUploadNum}张</p>
									</c:when>
									<c:otherwise>
										<p>${uploadTipDesc}</p>
									</c:otherwise>
								</c:choose>
							</div>
						</div>
						<div class="statusBar" style="display:none;">
							<div class="progress">
								<span class="text">0%</span>
								<span class="percentage"></span>
							</div><div class="info"></div>
							<div class="btns">
								<div id="${input}filePicker2" class="zgq_filePicker2"></div><div class="uploadBtn">开始上传</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				<button type="button" class="btn btn-info" id="${input}OKBtn">确认</button>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal -->
</div>
<script type="text/javascript">
	$(function(){
		$("#${input}OKBtn").on("click",function(){
			$('#${input}myModal').modal('hide');
			${input}SelectAction();
		});
	});
	function ${input}FinderOpen(){
		$('#${input}myModal').modal('show');
	}
	function ${input}SelectAction(){
		var url="", files=window.uploadFiles;
		for(var i=0; i<files.length; i++){//<c:if test="${type eq 'thumb'}">
			url += files[i].url;//</c:if><c:if test="${type ne 'thumb'}">
			url += files[i].url;//</c:if>
			if (i<files.length-1 && files.length != 0) url+=",";
		}//<c:if test="${vUploadNum gt '1'}">
		if(files.length != 0){
			$("#${input}").val($("#${input}").val()+($("#${input}").val()==""?url:","+url));
		}//</c:if><c:if test="${vUploadNum le '1'}">
		if(files.length == 0){
			$("#${input}").val(url);
		}else{
			$("#${input}").val(url);
		}//</c:if>
		${input}Preview();
	}
	function ${input}Del(obj){
		var url = $(obj).prev().attr("url");
		$("#${input}").val($("#${input}").val().replace(","+url,"","").replace(url+",","","").replace(url,"",""));
		console.log($("#${input}").val());
		if($("#${input}").val() == ","){
			$("#${input}").val("");
		}
		${input}Preview();
	}
	function ${input}DelAll(){
		$("#${input}").val("");
		${input}Preview();
	}
	function ${input}Preview(){
		var li, urls = $("#${input}").val().split(",");
		$('#${input}Preview').children().remove();
		for (var i=0; i<urls.length; i++){
			if (urls[i]!="" && urls[i]!="/"){
				<%--//<c:if test="${type eq 'thumb' || type eq 'images'}">--%>
				<%--li = "<li><img onclick=\"javascript:location.href=\"+urls[i]+\"\"  src=\""+urls[i]+"\" url=\""+urls[i]+"\" style=\"max-width:${empty maxWidth ? 200 : maxWidth}px;max-height:${empty maxHeight ? 200 : maxHeight}px;_height:${empty maxHeight ? 200 : maxHeight}px;border:0;padding:3px;\">";--%>
				<%--//</c:if><c:if test="${type ne 'thumb' && type ne 'images'}">--%>
				// li += "<li><a href=\""+urls[i]+"\" url=\""+urls[i]+"\" target=\"_blank\">"+decodeURIComponent(urls[i].substring(urls[i].lastIndexOf("/")+1))+"</a>";
				li = "<li><a href=\""+urls[i]+"\" url=\""+urls[i]+"\" target=\"_blank\">"+
						"<img onclick=\"javascript:location.href=\"+urls[i]+\"\"  src=\""+urls[i]+"\" url=\""+urls[i]+"\" style=\"max-width:${empty maxWidth ? 200 : maxWidth}px;max-height:${empty maxHeight ? 200 : maxHeight}px;_height:${empty maxHeight ? 200 : maxHeight}px;border:0;padding:3px;\">"
						+"</a>";
				<%--//</c:if>--%>
				li += "&nbsp;&nbsp;<c:if test="${!readonly}"><a href=\"javascript:\" onclick=\"${input}Del(this);\">${closeImgTmp}</a></c:if></li>";
				$('#${input}Preview').append(li);
			}
		}
		if ($('#${input}Preview').text() == ""){
			$('#${input}Preview').html("<li style='list-style:none;padding-top:5px;'>无</li>");
		}
	}
	${input}Preview();
</script>
